<template>
	<div class="feedback">
		<div class="back">
			<el-button class="btn" type="primary" @click="goback">返回</el-button>
		</div>
		<div class="pageTicket">
			<el-table :data="pageTicket" style="width: 100%">
			    <el-table-column prop="userName" label="意见人">
				</el-table-column>
			    <el-table-column prop="wareName" label="商品名称">
				</el-table-column>
			    <el-table-column prop="ordersId" label="订单号">
				</el-table-column>
			    <el-table-column prop="commentTime" label="反馈时间">
				</el-table-column>
			</el-table>
			<h3 class="fank">反馈内容
				<p v-for="x in pageTicket" :key="x">
					<span>{{x.commentContent}}</span>
					<span class="imgBox">
						<img v-for="y in imgs" :key="y" :src="baseUrl+y"/>
					</span>
				</p>
			</h3>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				baseUrl:require("../assets/baseUrl.js").baseUrl,
				pageTicket:[],
				imgs:[],
			}
		},
		methods:{
			//返回上一级
			goback(){
				this.$router.go(-1)
			},
			
			Time(){
				this.pageTicket.forEach(v=>{
					let str=v.commentTime+""
					//console.log(str)
					v.commentTime=str.substring(0,10)
				})
			},
			//详情
			getCuntent(){
				//接口	http://localhost:8081/oponion/xiang
				if(sessionStorage.getItem("adminRole")==2){
					this.$http.post(this.baseUrl + 'comments/menxiang',{
						commentId:this.$route.query.commentId
					}).then(res=>{
						//console.log(res)
						if(res.data.code == 200){ 
							this.pageTicket=res.data.data.comment
							this.imgs=res.data.data.commentImgs
							this.Time()
						}
					})
				}else{
					this.$http.post(this.baseUrl + 'comments/xiang',{
						commentId:this.$route.query.commentId
					}).then(res=>{
						//console.log(res)
						if(res.data.code == 200){
							this.pageTicket=res.data.data.comment
							this.imgs=res.data.data.commentImgs
							this.Time()
						}
					})
				}
			}
		},
		mounted() {
			//获取详情
			this.getCuntent()
		}
	}
</script>

<style lang="less">
	
	.feedback{
		width: 90%;
		margin: 0 auto;
		.pageTicket{
			margin-top: 3%;
			.el-table tr{
				background-color: #fcfcfc;
				color: #333;
				font-size: 15px;
				font-weight: bolder;
			}
			.el-table th.el-table__cell{
				background-color: #fcfcfc;
			}
			.el-table th.el-table__cell>.cell{
				color: #333;
				font-size: 19px;
			}
			.fank{
				margin-top: 5%;
				
				p{
					width: 100%;
					border: 2px solid #a7a6a6;
					border-radius: 5px;
					margin-top: 10px;
					span{
						display: block;
						font-weight: normal;
						margin-top: 15px;
						margin-left: 10px;
					}
					.imgBox{
						// margin-top: 70px;
						img{
							height: 180px;
							margin-right: 5%;
						}
					}
				}
			}
			.el-table__empty-block{
				background-color: #fcfcfc;
			}
			.el-table *{
				border: none !important;
				text-align: center;
			}
			.el-table::before{
				height: 0px;
			}
		}
	}
	
</style>